// 一些常用的flex布局的样式，可以直接引用
._flex {
    display: flex;
}
._flex-wrap { // 可换行
    display: flex;
    flex-wrap: wrap;
}

// 常用组合
._flex-center { // 垂直水平居中
    display: flex;
    align-items: center;
    justify-content: center;
}
._flex-center-between { // 垂直居中，水平两端对齐
    display: flex;
    align-items: center;
    justify-content: space-between;
}

// 水平对齐
._justify-start { // 左
    display: flex;
    justify-content: flex-start;
}
._justify-end { // 右
    display: flex;
    justify-content: flex-end;
}
._justify-center { // 中
    display: flex;
    justify-content: center;
}
._justify-space-between { // 两端 - 0项目空隙
    display: flex;
    justify-content: space-between;
}
._justify-space-around { // 两端 - 0.5项目空隙
    display: flex;
    justify-content: space-around;
}
._justify-space-evenly { // 两端 - 1项目空隙
    display: flex;
    justify-content: space-evenly;
}

// 竖直对齐
._align-start { // 上
    display: flex;
    align-items: flex-start;
}
._align-center { // 中
    display: flex;
    align-items: center;
}
._align-end { // 下
    display: flex;
    align-items: flex-end;
}
._align-stretch { // 拉伸
    display: flex;
    align-items: stretch;
}

// 缩放
._flex-grow-0 { // 不扩展
    flex-grow: 0;
}
._flex-grow-1 { // 扩展
    flex-grow: 1;
}
._flex-shrink-0 { // 不收缩
    flex-shrink: 0;
}
._flex-shrink-1 { // 收缩
    flex-shrink: 1;
}